<ng-template #titleTemplate>
  <ng-template [ngTemplateOutlet]="apesTitle"></ng-template>
</ng-template>
<ng-template #descriptionTemplate>
  <ng-template [ngTemplateOutlet]="apesDescription"></ng-template>
</ng-template>
<div class="{{prefixCls}}-item-tail" *ngIf="last !== true"></div>
<div class="{{prefixCls}}-item-icon">
  <ng-template [ngIf]="!showProcessDot">
    <!-- 完成状态样式 -->
    <span class="{{prefixCls}}-icon anticon anticon-check" *ngIf="apesStatus === 'finish' && !apesIcon">
      <i apes-icon apesType="check" apesTheme="outline"></i>
    </span>
    <!-- 错误状态样式 -->
    <span class="{{prefixCls}}-icon anticon anticon-cross" *ngIf="apesStatus === 'error' && !apesIcon"></span>
    <!-- 处理中、未完成状态样式 -->
    <span class="{{prefixCls}}-icon" *ngIf="(apesStatus === 'process' || apesStatus === 'wait') && !apesIcon">{{ index + 1 }}</span>
    <!-- 模板状态样式 -->
    <span class="{{prefixCls}}-icon" *ngIf="apesIcon">
      <ng-container *ngIf="isIconString; else iconTemplate">
        <!--<i [ngClass]="apesIcon"></i>-->
        <i apes-icon [apesType]="apesIcon"></i>
      </ng-container>
      <ng-template #iconTemplate>
        <ng-template [ngTemplateOutlet]="apesIcon"></ng-template>
      </ng-template>
    </span>
    <!-- 字体状态样式 -->
    <span class="{{prefixCls}}-icon" *ngIf="apesStatus === 'string' && !apesIcon">
      <span>{{apesType}}</span>
    </span>
    <!-- 两行字体状态样式 -->
    <span class="{{prefixCls}}-icon" *ngIf="apesStatus === 'stringMore' && !apesIcon">
      <span>{{apesType}}</span>
    </span>
    <!-- 未完成字体状态样式 -->
    <span class="{{prefixCls}}-icon" *ngIf="apesStatus === 'stringWait' && !apesIcon">
      <span>{{apesType}}</span>
    </span>
    <!-- 处理中字体状态样式 -->
    <span class="{{prefixCls}}-icon" *ngIf="apesStatus === 'stringProcess' && !apesIcon">
      <span>{{apesType}}</span>
    </span>
  </ng-template>
  <ng-template [ngIf]="showProcessDot">
    <span class="{{prefixCls}}-icon">
      <ng-template #processDotTemplate>
        <span class="{{prefixCls}}-icon-dot"></span>
      </ng-template>
      <ng-template [ngTemplateOutlet]="customProcessTemplate||processDotTemplate"
                   [ngTemplateOutletContext]="{ $implicit: processDotTemplate, status:apesStatus, index:index }"></ng-template>
    </span>
  </ng-template>
</div>
<div class="{{prefixCls}}-item-content">
  <div class="{{prefixCls}}-item-title">
    <ng-container *ngIf="isTitleString; else titleTemplate">{{ apesTitle }}</ng-container>
  </div>
  <div class="{{prefixCls}}-item-description">
    <ng-container *ngIf="isDescriptionString; else descriptionTemplate">{{ apesDescription }}</ng-container>
  </div>
</div>
